import React, { useContext, useEffect, useImperativeHandle, useLayoutEffect, useReducer, useRef, useState } from 'react'
const App = () => {

    /*
      官方推荐一开始的时候先使用 useEffect，只有在 useEffect 无法解决问题的时候可以尝试使用 
      useLayoutEffect，useLayoutEffect 可能会影响性能。尽可能使用 useEffect。
      两者区别是 useEffect 是一个异步执行的，而 useLayoutEffect 是同步执行的
      执行时机不同，但是使用方式完全一致
    */ 

    useEffect(()=>{
      console.log('useEffect 被执行了');
    })

    useLayoutEffect(()=>{
      console.log('useLayoutEffect 被执行了');

      return ()=>{
        // 清除副作用
        
      }
    }, [])

    return (
    <div >
      App
    </div>
  )
}
export default App